<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <link href="css/mui.css" rel="stylesheet"/>
</head>

<body>
<div class="mui-content">
    <ul class="mui-table-view">
        <li class="mui-table-view-cell mui-media">
            <a id="link_myface" href="javascript:;">
						<span class="mui-pull-right mui-icon mui-icon-arrowright"
                              style="line-height: 42px;color: #ADADAD;margin-right: 3px;"></span>
                <img id="user_img" class="mui-media-object mui-pull-right" src="image/face.jpeg">
                <div class="mui-media-body" style="line-height: 42px; font-size: 16px;">
                    头像
                </div>
            </a>
        </li>
        <li class="mui-table-view-cell mui-media">
            <a id="link_nickname" href="javascript:;">
						<span class="mui-pull-right mui-icon mui-icon-arrowright"
                              style="line-height: 42px;color: #ADADAD;margin-right: 3px;"></span>
                <span id="user_nickname" class="mui-pull-right"
                      style="line-height: 42px; font-size: 14px;"></span>
                <div class="mui-media-body" style="line-height: 42px; font-size: 16px;">
                    昵称
                </div>
            </a>
        </li>
        <li class="mui-table-view-cell mui-media">
            <a href="javascript:;">
						<span class="mui-pull-right mui-icon mui-icon-arrowright"
                              style="line-height: 42px;color: #ADADAD;margin-right: 3px;"></span>
                <span id="user_username" class="mui-pull-right"
                      style="line-height: 42px; font-size: 14px;"></span>
                <div class="mui-media-body" style="line-height: 42px; font-size: 16px;">
                    账号
                </div>
            </a>
        </li>
        <li class="mui-table-view-cell mui-media">
            <a id="link_qr_code" href="javascript:;">
						<span class="mui-pull-right mui-icon mui-icon-arrowright"
                              style="line-height: 42px;color: #ADADAD;margin-right: 3px;"></span>
                <img class="mui-media-object mui-pull-right " src="image/qrcode.png"
                     style="max-width: 20px; height: 20px; margin-top: 12px; ">
                <div class="mui-media-body" style="line-height: 42px; font-size: 16px;">
                    二维码
                </div>
            </a>
        </li>
    </ul>
    <br/>
    <ul class="mui-table-view">
        <li id="quit_account" class="mui-table-view-cell mui-media" style="text-align: center;">
            退出登录
        </li>
    </ul>
</div>
<script src="js/mui.js"></script>
<script src="js/app.js"></script>
<script type="text/javascript">
    mui.init();
    mui.plusReady(function () {
        //获得当前的webview
        var meWebview = plus.webview.currentWebview();
        //刷新用户信息
        meWebview.addEventListener("show", function () {
            refreshUserInfo();
        });
        //点击头像栏 页面跳转
        var link_myface = document.getElementById("link_myface");
        link_myface.addEventListener("tap", function () {
            mui.openWindow("myFace.html", "myFace.html");
        });

        //点击头像栏 页面跳转
        var link_nickname = document.getElementById("link_nickname");
        link_nickname.addEventListener("tap", function () {
            mui.openWindow("myNickName.html", "myNickName.html");
        });

        //点击二维码栏 页面跳转
        var link_qr_code = document.getElementById("link_qr_code");
        link_qr_code.addEventListener("tap", function () {
            mui.openWindow("myQRCode.html", "myQRCode.html");
        });

        //点击退出,清空缓存数据 页面跳转登录页面
        var quit_account = document.getElementById("quit_account");
        quit_account.addEventListener("tap", function () {
            app.delUserGlobalInfo();
            mui.openWindow("login.html", "login.html");
        });

        //添加自定义事件,刷新头像
        window.addEventListener("refresh", function () {
            refreshUserInfo();
        });
    });

    //刷新用户信息
    function refreshUserInfo() {
        var user = app.getUserGlobalInfo();
        //如果用户信息不为空则刷新信息
        if (user != null) {

            var faceImage = user.faceImage;
            var nickname = user.nickname;
            var username = user.username;
            var qrcode = user.qrcode;

            var user_nickname = document.getElementById("user_nickname");
            var user_username = document.getElementById("user_username");

            //刷新账号与昵称
            user_nickname.innerText = nickname;
            user_username.innerHTML = username;
            //如果头像不为空则刷新头像
            var user_img = document.getElementById("user_img");
            if (app.isNotNull(faceImage)) {
                user_img.src = app.imgServerUrl + faceImage;
            }else{
                user_img.src = "image/face.jpeg";
            }
            //如果二维码不为空则刷新二维码
            /* if(app.isNotNull(qrcode)){
                alert(JSON.stringify(qrcode));
                var user_qrcode = document.getElementById("user_qrcode");
                user_qrcode.src = app.imgServerUrl+qrcode
            } */
        } else {
            //如果登录信息失效则返回登录页面
            app.returnLogin();
        }
    }
</script>
</body>

</html>
